<template>
	<view class="">
		<view class="lsits">
			<view class="" v-for="(item,index) in list" :key='index'>
				<view class="lsits_image">
					<image :src="'https://www.sdxiecheng.cn/'+item.image" mode=""></image>
				</view>
				<view class="lsits_text">
					<h2>
						{{item.name}}
					</h2>
					<view class="seotext">
						{{item.describle}}
					</view>
					<view class="list_bottom text flex_sb flxe_al">
						<text>
							{{item.price}}/{{item.unit}}
						</text>
						<view class="" @click="tan(item.id,index,item.is_new_user,item.is_new)">
							立即下单
						</view>	
					</view>
				</view>
			</view>

		</view>
		<u-popup v-model="show" mode='bottom' border-radius="10" close-icon='close-circle' close-icon-size=50
			close-icon-color='#B8B8B8'>
			<view class="sky_pos" @click="show=false">
				<image src="https://z1.ax1x.com/2023/09/15/pPWscnI.png" mode=""></image>
			</view>
			<view class="xd_box">
				<view class="flex">
					<view class="xd_box_img">
						<image :src="'https://www.sdxiecheng.cn/'+good_box.image"></image>
					</view>
					<view class="xd_box_text">
						<h2>{{good_box.name}}</h2>
						<view class="xd_box_seo">
							{{good_box.describle}}
						</view>
						<view class="xd_box_pice">
							¥{{good_box.price}}
						</view>
					</view>

				</view>
				<view class="goods_num_box flex_sb flxe_al" >
					<view class="">购买数量
					
					</view>
					<view class="">
						<u-number-box   :disabled="disabled" :min='1' disabled-input=true v-model="nums" :input-width="100" :input-height="60"></u-number-box>
					</view>
				</view>
				<!-- item.id -->
				<button class="goods_num_box_button" @click="xiadan(good_box.id,good_box.is_new_user,good_box.is_new)">提交</button>
			</view>

		</u-popup>
		
		<u-toast ref="uToast" />
		
	</view>
</template>

<script>
	export default {
		name: "goods_lists",
		props: {
			list: {
				type: Array,
				required: true
			},
			type: '',
			shows:'',

		},
		data() {
			return {
				ids: 0, //产品id
				nums: 1, //数量
				show: false,
				good_box: {} ,//弹窗显示产品数据
				disabled:false//是否禁用点击加减
				
			};
		},
		onShow(){
			this.show=false
			this.nums=1
		},
		methods: {
			// 步进器发生变化的时候
			valChange(e){
				console.log(111)
				this.$refs.uToast.show({
					title: '新用户特惠，只能购买一个哦'
				})
			},
			getpomise(){
				promise.then
				
			},
			// 点击弹窗下单
			xiadan(id,is_new_user,is_new) {
				if (is_new == 1 && is_new_user == 0) {
					this.$refs.uToast.show({
						title: '您不属于新用户'
					})
					return
				}

				uni.navigateTo({
					url: '../order/place_order/on-line?id=' + id + '&shoecabinet_id=' + this
						.shoecabinet_id + '&num=' + this.nums
				})

			},
			tan(id,index,is_new_user,is_new) {
				if (is_new == 1 && is_new_user == 0) {
					this.$refs.uToast.show({
						title: '您不属于新用户'
					})
					return
				}
				
				
				if (this.type == 0) {
					uni.navigateTo({
						url: '../order/place_order/place_order?id=' + id + '&shoecabinet_id=' + this
							.shoecabinet_id
					})
				} else {
					this.show = true
					this.nums = 1
					this.ids = index
					this.list.forEach((res, index1) => {
						if (index == index1) {
							this.good_box = res
						}
					})
				}
				
				if(this.good_box.id==15){
					this.disabled=true
				}else{
					this.disabled=false
				}
				


			}
		}
	}
</script>

<style scoped>
	.lsits {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		width: 100%;
	}

	.lsits>view {
		background: #ffffff;
		width: calc(50% - 10rpx);
		margin-bottom: 20rpx;
	}

	image {
		max-width: 100%;
		max-height: 100%;
	}

	.lsits_image {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 350rpx;
		box-sizing: border-box;
		padding: 20rpx;
	}

	.lsits_image image {
		object-fit: cover;
	}

	.lsits_text {
		padding: 20rpx;
	}

	.lsits_text>.seotext {
		font-size: 24rpx;
		font-weight: 400;
		height: 56rpx;
		color: #7C7C7C;
		line-height: 30rpx;
		display: block;
		margin-bottom: 24rpx;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		/* 限制显示的行数 */
		-webkit-box-orient: vertical;
		/* 设置垂直方向排列 */
		overflow: hidden;
		/* 隐藏超出的内容 */
		text-overflow: ellipsis;
		/* 超出部分显示省略号 */
	}

	.lsits_text>h2 {
		height: 80rpx;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		/* 限制显示的行数 */
		-webkit-box-orient: vertical;
		/* 设置垂直方向排列 */
		overflow: hidden;
		/* 隐藏超出的内容 */
		text-overflow: ellipsis;
		/* 超出部分显示省略号 */
		margin: 0 0 13rpx;
		font-size: 30rpx;
		font-weight: 400;
		color: #E50606;
	}

	.list_bottom>text {
		font-size: 24rpx;
		font-weight: 800;
		color: #333333;
	}

	.list_bottom>view {
		padding: 9rpx 10rpx;
		box-sizing: border-box;
		border: 2rpx solid #FBAA27;
		border-radius: 21rpx;
		font-size: 24rpx;
		font-weight: 400;
		color: #FBAA27;
	}

	.sky_pos {
		position: absolute;
		top: 20rpx;
		right: 20rpx;
	}

	.sky_pos>image {
		width: 45rpx;
		height: 45rpx;
	}
	
	.uni-input-input,
	.u-number-input ,.u-input-disabled{
		background: #fff !important;
		width: 56rpx !important;
		font-size: 32rpx !important;
		font-weight: 400 !important;
		color: #333333 !important;
	}
	
	
		
	
</style>